<template>
	<view>
		<view class="pop-win-bg" @click="closePicker" catchtouchmove="true" v-show="show"></view>
		<view class="pop-win" :class="{'pop-win-show': show}">
			<view >
				<view class="item" v-for="(item, key) in items" :key="key" @click="select(key)">
					<view>{{item}}</view>
				</view>
			</view>
			<view class="item" @click="close">取消</view>
		</view>
	</view>
</template>

<script>
	export default {

		name: "lims-popup",
		data() {
			return {
				items: [],
				funs: [],
				show: false,
			};
		},
		methods:{
			select(index){
				this.funs[index]();
				this.show = false;
			},
			popShow(items, funs){
				if(items) this.items = items;
				if(funs) this.funs = funs;
				setTimeout(() => {
					this.show = true;
				},0);
			},
			close(){
				this.show = false;
			},
			//用来解决报错
			closePicker() {},
		}
	}
</script>

<style>
	
	.pop-win-bg {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		z-index: 50;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.3);
	}
	
	.pop-win {
		flex-direction: column;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 100;
		background-color: #FFFFFF;
		transform: translateY(100%);
		transition: all 200ms ease;
	}
	
	.pop-win-show {
		transform: translateY(0) !important;
	}
	
	.item {
		padding: 15upx 0;
		text-align: center;
		border-bottom: 1px solid #D8D8D8;
		font-size: 40upx;
		color: #666666;
	}
	
</style>
